<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  
  <title>Reproduction of issue #99</title>
  <link rel="stylesheet" href="../../../../../../dist/css/ink.css" />

  
  <style type="text/css">
    .sticky{
    width:40%;
    padding:10px;
    background-color:black;
    color:white;
}
  </style>
  


</head>
<body>
  <div id="up">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ac sollicitudin velit. Donec venenatis purus in lectus pharetra fermentum. Vestibulum dignissim arcu ut eros dignissim venenatis. Aliquam erat volutpat. Maecenas lacus libero, tempor quis tellus dictum, lacinia tempor sem. Curabitur fringilla suscipit eros, non suscipit mauris fringilla id. Vestibulum vulputate orci mi, egestas aliquam elit blandit quis. Sed est augue, egestas sit amet auctor ut, pellentesque eget ante. Nunc gravida, velit ut rhoncus molestie, risus justo tempus nisi, volutpat dignissim enim sem placerat dui. Praesent ac consectetur sem. Duis varius dictum sapien, ut lacinia eros scelerisque eu. Morbi consequat ipsum purus, at vestibulum odio convallis a. Nunc sed rhoncus libero. Vivamus urna diam, adipiscing quis lectus vel, tristique lobortis urna. Sed eleifend arcu id arcu cursus, sed congue velit vehicula. Quisque at scelerisque ipsum, vel tristique orci.</div>

  <div id="myDiv" data-offset-top="20px" data-offset-bottom="20px" data-bottom-element="#down" data-top-element="#up" class="sticky">
      <div style="height:10em">
          something like this?
      </div>
  </div>

Aliquam porta imperdiet leo eget cursus. Integer ornare tristique laoreet. Nullam sollicitudin mauris a ipsum pretium ornare. Mauris eget cursus odio. Donec sit amet ipsum ac metus suscipit convallis. Aliquam sed risus venenatis, pellentesque lorem ac, fermentum diam. Ut blandit sit amet ligula eu suscipit. Mauris viverra, quam sit amet accumsan ornare, velit justo suscipit lectus, vel sodales mi nulla at diam. Ut pretium lacus quis facilisis ornare.

Cras laoreet leo ut semper iaculis. Nam nisi augue, tincidunt nec nunc quis, tempus iaculis lorem. Donec eu quam et quam mollis lobortis. Proin lacinia purus sit amet nisi fermentum pellentesque ac et est. Interdum et malesuada fames ac ante ipsum primis in faucibus. Suspendisse consectetur velit neque, ac pulvinar orci pharetra eget. Vivamus mauris nunc, placerat et rutrum eu, vestibulum eget neque.

In suscipit suscipit quam at tempus. Aenean ut nisl ante. Nam aliquet mauris nec ipsum lacinia facilisis. Nunc sit amet dapibus nisi, et tempor lacus. Quisque interdum egestas lectus. Sed at elementum enim. Nam bibendum massa eros. Cras at vehicula nunc. Nam rutrum metus eu purus lobortis, at dignissim felis vehicula. Nullam aliquet, augue non hendrerit molestie, neque risus dictum lorem, ac varius nunc dolor nec massa. Nam lacinia pulvinar accumsan. Aliquam erat volutpat. Mauris dictum neque elit, ut porta dolor pharetra quis. Vestibulum viverra dolor felis, id euismod risus fringilla id.

Curabitur posuere nibh ut ipsum commodo, nec iaculis diam scelerisque. Suspendisse lobortis, ante vitae mollis luctus, tortor eros lacinia est, ac dapibus lacus mauris nec eros. Aenean gravida ante sit amet suscipit mattis. Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque porta sollicitudin lorem, quis tempor leo semper molestie. Fusce in neque auctor, venenatis risus at, feugiat velit. Proin bibendum non leo a euismod.

<div id="down">
    Aenean dignissim scelerisque tempor. Nulla sed purus quis ligula consequat porttitor. Fusce viverra lorem et quam suscipit, eu accumsan ante sagittis. Donec tincidunt turpis ut posuere scelerisque. Curabitur sit amet tempor turpis, quis pulvinar mauris. Vestibulum faucibus sem sit amet volutpat laoreet. Cras ac tempor ipsum. Proin porttitor, massa id porta tristique, sem tortor sagittis magna, id iaculis sem lectus accumsan erat. Suspendisse sit amet lobortis eros.
</div>

Vivamus enim diam, vulputate ac posuere nec, suscipit sed diam. Aenean nulla velit, fermentum at aliquam ac, consectetur pellentesque orci. Phasellus a tellus vel libero rutrum tristique posuere non ante. Integer cursus mattis posuere. Aenean ipsum magna, consectetur id rutrum eget, sollicitudin vitae est. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam ac justo leo. Duis rhoncus, erat eu rutrum gravida, risus neque imperdiet diam, eu fermentum nibh dui sed lorem. Mauris ac gravida ligula. Phasellus eleifend magna sit amet orci pellentesque, non molestie nisl ultrices. Nunc ac mauris aliquam, adipiscing orci ac, feugiat urna. Curabitur mauris massa, commodo vitae tristique in, dictum nec elit. Maecenas facilisis dolor semper, accumsan quam sed, pharetra lacus. Curabitur sit amet leo laoreet, ullamcorper tortor ut, tristique tellus.

Donec purus odio, pellentesque at pellentesque a, gravida id metus. Vivamus non massa urna. Pellentesque suscipit, augue a feugiat rhoncus, ipsum nulla tincidunt tellus, et condimentum eros diam ut lacus. Integer dapibus cursus ornare. Proin tempus ornare euismod. Morbi facilisis risus ut felis pellentesque, vitae tempor urna volutpat. Nunc id blandit erat. Fusce porttitor magna odio, sed volutpat dui convallis sed. Quisque tristique vel dolor id consequat. Nam hendrerit magna sit amet nisi scelerisque, vitae vulputate nunc sodales. Mauris tempor mi ac sapien mattis, vitae aliquam sem fermentum. Vestibulum tincidunt sagittis erat. Nam erat est, consectetur non enim vitae, elementum adipiscing odio. Vivamus viverra eros vitae nibh accumsan tincidunt. Quisque bibendum nisi sit amet dui consequat, at congue sapien sollicitudin. Integer ullamcorper tellus tortor.

Vestibulum eget eleifend felis. Cras varius interdum nisi vitae fermentum. Nullam tempus blandit dui, in tempor odio fermentum et. Quisque sed leo velit. Mauris scelerisque diam quis massa dictum vestibulum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus viverra lobortis mi in eleifend. Donec sit amet risus a diam posuere commodo. Phasellus mattis facilisis tortor, et scelerisque mi fermentum ut. Suspendisse pretium mattis dui quis dictum. Sed tempor dui sed iaculis tempus. Maecenas tempus hendrerit velit eu ullamcorper. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris tincidunt eu tellus id ornare.

Donec quis magna egestas sapien vestibulum pretium in tempor lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse urna purus, sollicitudin quis lectus sed, posuere vehicula nisi. Praesent accumsan viverra justo, eget lacinia libero eleifend vel. Proin congue erat vel augue dignissim, et placerat mauris consectetur. Cras eget pellentesque lorem. Pellentesque nulla dui, gravida hendrerit dapibus vitae, iaculis at velit. Morbi pulvinar nec lorem sit amet sagittis. Donec accumsan rhoncus lacus eu tempor. Cras dapibus tortor pretium ultricies sagittis.

Nulla fringilla lectus turpis, malesuada aliquam nunc egestas vel. Nulla facilisi. Morbi eu purus mi. Etiam luctus feugiat tortor sit amet pretium. Phasellus aliquet ac diam eget suscipit. Ut sagittis, sem a ullamcorper posuere, turpis augue sodales lacus, eu accumsan ipsum nisi vel eros. Sed vestibulum nisi quis lorem porta iaculis. Donec vel dolor fringilla, condimentum purus et, lobortis sem. Donec neque eros, consectetur at molestie nec, mattis id neque. Nam fringilla pulvinar ante, a condimentum eros vestibulum quis.


  



<script type="text/javascript" src="../../../../Ink/1/lib.js"></script>
<script>
    Ink.setPath('Ink', '../../../../Ink/');
</script>
<script type="text/javascript">
Ink.requireModules(['Ink.UI.Sticky_1'], function (Sticky) {
    var stickyObj = new Ink.UI.Sticky('#myDiv');
})
</script>


</body></html>
